/*
 * @Author: Elephant 
 * @Date: 2017-08-28 14:20:12 
 * @Last Modified by: Elephant
 * @Last Modified time: 2017-08-28 15:14:44
 */

 @color-gray:#eaeaea;

/* loading 动画 */ 
@keyframes loading {
    0%{
        width:100%;
    }
    50%{
        width:60%;
    }
    100%{
        width:100%;
    }
}
.loading{
    height: 15px !important;
    animation: loading 1s ease-in-out infinite;
}
.loading-delay{
    height: 15px !important;
    animation: loading 1s ease-in-out 0.5s infinite;
}

/* 主体样式 */ 
 .placeholder-loading{
     width: 100%;
     max-width: 600px;
     padding: 20px;
     box-sizing: border-box;
     background-color: white;
     border-radius: 10px;
     span{
        display: inline-block;        
        vertical-align: middle;
     }
    /* 作者区 */  
     .author{
         margin-bottom: 10px;
        .avatar{
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background-color: @color-gray;
        }
        .name{
            width: 20%;
            height: 15px;
            background-color: @color-gray;
        }
     }
    /* 内容条 */  
     .text{
         width: 100%;
         .text-content{
            width: 100%;
            height: 20px;
            margin-bottom: 10px;
            background-color: @color-gray;
         }
     }
     .text-25{
         width: 25%;
     }
     .text-50{
         width: 50%;
     }
     .text-75{
         width: 75%;
     }
    /* 标签 */  
     .meta{
         .icon{
             width: 10px;
             height: 10px;
             background-color: @color-gray;
         }
         .small{
             width: 10%;
             height: 10px;
             background-color: @color-gray;
         }
     }
 }